export const getModel = () => ({
  'componentProps.type': '',
  'componentProps.position': 'top',
  'componentProps.fontStyle': {
    fontFamily: undefined,
    fontSize: 12
  },
  'componentProps.textStyle': {
    bold: false,
    italic: false,
    lineThrough: false,
    // textAlign: 'left',
    underline: false
  },
  'componentProps.defaultState': '',
  'componentProps.activeState': ''
})

export const getSchema = () => ({
  type: 'object',
  properties: {
    'componentProps.type': {
      type: 'string',
      description: '风格'
    },
    'componentProps.position': {
      type: 'string',
      description: '位置'
    },
    'componentProps.fontStyle': {
      type: 'object',
      description: '字体'
    },
    'componentProps.textStyle': {
      type: 'object',
      description: '文本'
    },
    'componentProps.defaultState': {
      type: 'string',
      description: '默认态'
    },
    'componentProps.activeState': {
      type: 'string',
      description: '激活态'
    }
  }
})

export const getUiSchema = () => [
  {
    title: '高级',
    type: 'group',
    children: [
      {
        label: '风格',
        type: 'custom-change',
        modelKey: 'componentProps.type',
        component: 'BITabsTypeChange'
      },
      {
        label: '位置',
        type: 'custom-change',
        modelKey: 'componentProps.position',
        component: 'BIRadioButtonGroup',
        props: {
          options: [
            { label: '顶部', value: 'top' },
            { label: '左侧', value: 'left' },
            { label: '右侧', value: 'right' }
          ]
        }
      },
      {
        label: '字体',
        type: 'custom-change',
        modelKey: 'componentProps.fontStyle',
        component: 'BIFontStyleSelect'
      },
      {
        label: '',
        type: 'custom-change',
        modelKey: 'componentProps.textStyle',
        props: {
          showAlign: false
        },
        component: 'BIFontToolbar'
      },
      {
        label: '默认态',
        type: 'custom-change',
        modelKey: 'componentProps.defaultState',
        component: 'ComplexColorPicker'
      },
      {
        label: '选中态',
        type: 'custom-change',
        modelKey: 'componentProps.activeState',
        component: 'ComplexColorPicker'
      }
    ]
  }
]
